<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <!--主要-->
    <link rel="stylesheet" type="text/css" href="{MODULE_URL}template/mobile/style/style1/static/css/region.css" />
    <!--用户css-->
    <link rel="stylesheet" type="text/css" href="{MODULE_URL}template/mobile/style/style1/static/css/location.css" />
    <!--组件依赖js begin-->
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/zepto.js"></script>
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/zepto.extend.js"></script>
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/zepto.ui.js"></script>
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/zepto.fix.js"></script>
    <!--刷新-->
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/refresh.js"></script>
    <script type="text/javascript" src="{MODULE_URL}template/mobile/style/style1/static/js/gotop.js"></script>
    <style type="text/css">
    /*加载*/
    
    .ui-refresh-down {
        height: 42px;
        border-top: 1px solid #e4e4e4;
        border-bottom: 1px solid #e4e4e4;
        line-height: 42px;
        background: #f0f0f0;
        text-align: center;
    }
    
    .ui-refresh-icon {
        display: inline-block;
        content: '';
        background:url({MODULE_URL}template/mobile/style/style1/static/image/arrow-down.png) no-repeat;
        width: 12px;
        background-size: 12px;
        height: 7px;
        margin-right: 5px;
    }
    
    .ui-refresh-icon {
        display: inline-block;
        content: '';
        background:url({MODULE_URL}template/mobile/style/style1/static/image/arrow-down.png) no-repeat;
        width: 12px;
        background-size: 12px;
        height: 7px;
        margin-right: 5px;
    }
    
    .ui-loading {
        display: inline-block;
        content: '';
        background:url({MODULE_URL}template/mobile/style/style1/static/image/loading.gif) no-repeat;
        width: 16px;
        background-size: 16px;
        height: 16px;
        margin-right: 5px;
    }
    </style>
    <title>搜索结果-{$_W['uniaccount']['name']}</title>
</head>

<body>
    <!--page-->
    <div id="page">
        <header id="header">
            <div class="header_div">
                <div id="left_div" onClick="javascript:history.back();"></div>
                <div id="middle_div">
                    <form action="{php echo $this->createMobileUrl('register',array('op' => 'region'))}" method="post" id="suggest_form">
                        <input type="search" name="keywords" id="suggest_input" class="search_css" placeholder="请填写您的小区名" />
                        <input type="submit" id="suggest_submit" value="" />
                    </form>
                </div>
                <div id="right_div">
                    <div class="right_bottom"></div>
                    <div class="right_img"></div>
                </div>
            </div>
        </header>
        <!--cont-->
        <div class="cont">
            <div class="top_text"><span id="top_wz">为你推荐您附近的小区</span></div>
            <div class="ui-refresh">
                <ul class="data-list" id="xq_list">
                </ul>
                <div class="ui-refresh-down"></div>
            </div>
        </div>
        <!-- #EndLibraryItem -->
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=77E9802d7cfbcde01b5ea17f1388f35d"></script>
        <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
        <script type="text/javascript">
        (function() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(translatePoint, showError);
            } else {
                alert("您的浏览器不支持定位.");
                wd = 0;
                jd = 0;
                keyw = "";
                xqAjax(wd, jd, keyw);
            }

            function showError(error) //错误时回调
            {
                wd = 0;
                jd = 0;
                keyw = "";
                xqAjax(wd, jd, keyw)
            }

            function translatePoint(position) { //成功时回调
                var currentLat = position.coords.latitude;
                var currentLon = position.coords.longitude;
                var gpsPoint = new BMap.Point(currentLon, currentLat);
                BMap.Convertor.translate(gpsPoint, 0, initMap); //转换坐标 
            }
            initMap = function(point) {
                    wd = point.lat;
                    jd = point.lng;
                    keyw = "";
                    xqAjax(wd, jd, keyw)
                }
                /*ajax请求函数,判断共几页，呈现不同效果*/
            function xqAjax(wd, jd, keyw) {
                var url = "{php echo $this->createMobileUrl('register',array('op' => 'getaround'))}";
                $.ajax({
                    url: url,
                    async: false,
                    type: 'post',
                    dataType: 'json',
                    data: {
                        latitude: wd,
                        longitude: jd,
                        page: 1,
                        keyword: keyw
                    },
                    beforeSend: function() {
                        $("#xq_list").html("<li class='seach_loading'><img src='{MODULE_URL}template/mobile/style/style1/static/image/loading.gif'/>为您搜索中……</li>")
                    },
                    success: function(data) {
                        var $list = $('.data-list'),
                            html = (function(data) { //数据渲染
                                var liArr = [];
                                $.each(data.allhtml, function() {
                                    liArr.push(this.html);
                                });
                                return liArr.join('');
                            })(data);

                        $('.data-list').html(html)
                        if (data.page_count < 2) {
                            $(".ui-refresh-down").html("<span class='ui-refresh-label'>没有更多内容了</span>");
                        } else {
                            refreshFun(wd, jd, keyw);
                        }
                    },
                    error: function() {
                        alert('请求不到数据，请重新搜索！');
                    }

                })
            }

            /*组件初始化refreshFun函数*/

            function refreshFun(wd, jd, keyw) {
                var index = 1;
                $('.ui-refresh').refresh({
                    ready: function(dir, type) {
                        var me = this;
                        index++;
                        $.getJSON("{php echo $this->createMobileUrl('register',array('op' => 'getaround'))}", {
                            latitude: wd,
                            longitude: jd,
                            page: index,
                            keyword: keyw
                        }, function(data) {
                            var $list = $('.data-list'),
                                html = (function(data) { //数据渲染
                                    var liArr = [];
                                    $.each(data.allhtml, function() {
                                        liArr.push(this.html);
                                    });
                                    return liArr.join('');
                                })(data);

                            $list[dir == 'up' ? 'prepend' : 'append'](html);
                            if (index < data.page_count) {
                                me.afterDataLoading();
                            } else {
                                me.disable(dir, false);
                            }
                        });
                    }
                });

            }
            /*组件初始化js end*/
        })();
        </script>
        <script>
        function nowCat() {
            return ""
        }
        </script>
        <div id="gotop"></div>
        <script>
        $('#gotop').gotop();
        </script>
    </div>
    <!--page end-->
</body>

</html>
